<template>
	<view class="record">
		<custom-navi :show-home="false">验证记录</custom-navi>
		<view class="record-txt">
			<s-pull-scroll ref="pullScroll" :pullDown="pullDown" :pullUp="loadData">
				<view class="bgImg" v-if="recordList.length===0">
					<image src="/static/icon/mescroll-empty.png" mode=""></image>
					<view class="">
						~ 暂无相关数据 ~
					</view>
				</view>
				<view class="record-txt-list" v-for="(item,index) in recordList" :key='index'>
					<view class="code">
						<view class="code-title">核 验 码:</view>
						<view class="code-txt">{{item.awardCode}}</view>
					</view>
					<view class="tiem">
						<view class="tiem-title">核验时间:</view>
						<view class="tiem-txt">{{item.usageTime}}</view>
					</view>
				</view>
			</s-pull-scroll>
			
		</view>
	</view>
</template>

<script>
	import { findConponJournalList } from '../../api.js'
	import sPullScroll from '../../../components/s-pull-scroll/index.vue';
	export default {
		components: {
			sPullScroll
		},
		data(){
			return {
				page:'1',
				size:'10',
				recordList:[
					
				]
			}
		},
		onLoad() {
			this.listFrom()
		},
		methods:{
			async listFrom () {
				let params = {
					page:this.page,
					size:this.size
				}
			  try {
			    const { data } = await findConponJournalList(params)
			    console.log(data)
			    this.recordList = data.datas
				for(var i = 0;i<this.recordList;i++){
					this.recordList[i].awardCode=this.recordList[i].awardCode.replace(this.recordList[i].awardCode.substring(3, 7), "****")
					
				}
			  } catch (err) {
			    console.log(err)
			  }
			},
			refresh() {
				this.$nextTick(() => {
					this.$refs.pullScroll.refresh();
				});
			},
			pullDown(pullScroll) {
				setTimeout(() => {
					this.loadData(pullScroll);
				}, 200);
			},
			loadData(pullScroll) {
				setTimeout(() => {
					if (pullScroll.page == 1) {
						this.page =1
						this.size=10
						this.listFrom()
					}else{
						if(this.size>this.total){
							pullScroll.empty()
						}else{
							// this.page=this.page+1
							this.size=this.size+10
							// this.listPush()
							this.listFrom()
						}
					}
					// const curList = [];
					// for (let i = this.list.length; i < this.list.length + 20; i++) {
					// 	curList.push(i);
					// }
					// this.list = this.list.concat(curList);
					if (this.fromData.length > 60) {
						// finish(boolean:是否显示finishText,默认显示)
						pullScroll.finish(this.fromData.length > 5);
					} else {
						pullScroll.success();
					}
					
				}, 1000);
			},
		}
	}
</script>

<style lang="scss">
	.record{
		height: 100vh;
		background-color: #FFFFFF;
		&-txt{
			position: relative;
			height: 70%; 
			margin-top: 20rpx;
			.bgImg{
				width: 300rpx;
				height: 300rpx;
				margin: 0 auto;
				text-align: center;
				font-size: 24rpx;
				color: gray;
				margin-top: 100rpx;
				image{
					width: 100%;
					height: 100%;
				}
			}
			&-list{
				padding: 30rpx;
				border-bottom: 1rpx solid rgba(241,241,241,1);
				opacity:1;
				.code{
					display: flex;
					font-size:28rpx;
					font-family:PingFang SC;
					font-weight:400;
					color:rgba(3,3,3,1);
					// letter-spacing:65rpx;
					opacity:1;
					margin-bottom: 24rpx;
					&-title{
						margin-right: 46rpx;
					}
				}
				.tiem{
					display: flex;
					font-size:28rpx;
					font-family:PingFang SC;
					font-weight:400;
					color:rgba(149,151,166,1);
					opacity:1;
					&-title{
						margin-right: 46rpx;
					}
				}
			}
		}
	}
</style>
